项目简介
table view应该是iOS应用中最常用的UI element。最好的例子就是iPhone自带的一些应用,如电话,邮件,设置等。TED,Google+,Airbnb,微信等等都是很好例子。
参考链接:https://www.jianshu.com/p/25f062e903cf
作者:Andy_Ron
创建一个项目
- 项目名称为SimpleTable,模板为”Single View application”
设计UI
- 选中
Main.storyboard
,从Object library中拖动Table View
进入视图 - 改变
Table View
的大小至整个view,修改属性Prototype Cells
为1
- 选中
Table View Cell
,修改Style
为Basic,Identifier
为Cell。table view cell的标准类型有 basic、right detail、left detail 和 subtitle,当然还有定制类型custom。
- 选中
Table View
,设置四个spacing约束,上下左右的距离都设置为0
为UITableView添加两个协议
- Object library中的每一UI component都是对应一个class,如
Table View
就是对应UITableView
。可以通过点击并悬停在UI component上查看对应的class和介绍。 - 在
ViewController.swift
文件的UIViewController
后,添加代码, UITableViewDataSource, UITableViewDelegate
,表示ViewController
类实现了UITableViewDataSource
,UITableViewDelegate
两个协议。
出现红色感叹号,这是xcode的问题提示,点击参看问题描述:
Type ‘ViewController’ does not conform to protocol
‘UITableViewDataSource’
问题描述为ViewController
不符合协议UITableViewDataSource
。通过command+点击到UITableViewDataSource
中查看:
1 | public protocol UITableViewDataSource : NSObjectProtocol { |
UITableViewDataSource
协议中定义了很多方法,除了前两个方法没有optional
其它都有.有的表示这个方法不一定要实现,没有的就一定要实现,把这个两个方法实现了,问题提示就会消失。这两个方法从名字和返回值类型也大概能知道做了什么:public func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int
一个section有几行,也就是一个section有几个
UITableViewCell
, section就是一组UITableViewCell
的意思,Table View可以定义多个section,默认是一个。public func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell
返回每一行的
UITableViewCell
在
ViewController.swift
中定义一个变量restaurantNames
,类型是数组,表示一系列餐馆的名字。
1 | var restaurantNames = ["Cafe Deadend", "Homei", "Teakha", "Cafe Loisl", "PetiteOyster", "For Kee Restaurant", "Po's Atelier", "Bourke Street Bakery", "Haigh'sChocolate", "Palomino Espresso", "Upstate", "Traif", "Graham Avenue Meats AndDeli", "Waffle & Wolf", "Five Leaves", "Cafe Lore", "Confessional","Barrafina", "Donostia", "Royal Oak", "CASK Pub and Kitchen"] |
- 定义
UITableViewDataSource
的两个方法:
1 | func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { |
- 1 餐馆的数目就是section的行数
- 2 “Cell”与之前定义的
UITableViewCell
的Identifier
属性是对应的。dequeueReusableCell
方法是产生一个UITableViewCell
。 - 3
UITableViewCell
中有可算属性textLabel
,其实就是一个UILabel
,由于是可选属性,调用时也用可选链式调用cell.textLabel?.text